<template>
  <div class="container">
    <div class="sbgl-nav breadcrumb">
      <img src="static/img/shu.png" alt="">
      <span>个人中心</span>
      <span class="glyphicon glyphicon-chevron-right"></span>
      <span>修改个人资料</span>
    </div>
    <form class="form-horizontal" id="formEdit" @submit.prevent="submit()">
      <div class="form-group">
          <label for="inputtext1" class="col-sm-2 control-label col-sm-offset-3">用户ID：</label>
          <div class="col-sm-4">
            <input type="text" class="form-control" id="inputtext1" v-model="userModel.userid">
          </div>
      </div>
      <div class="form-group">
          <label for="inputtext" class="col-sm-2 control-label col-sm-offset-3">用户姓名：</label>
          <div class="col-sm-4">
            <input type="text" class="form-control" id="inputtext" v-model="userModel.username">
          </div>
      </div>
      <div class="form-group">
          <label for="inputnumber2" class="col-sm-2 control-label col-sm-offset-3">固定电话：</label>
          <div class="col-sm-4">
            <input type="number" class="form-control" id="inputnumer2" v-model="userModel.mobile">
          </div>
      </div>
      <div class="form-group">
          <label for="inputnumber4" class="col-sm-2 control-label col-sm-offset-3">手机：</label>
          <div class="col-sm-4">
            <input type="number" class="form-control" id="inputnumer4" v-model="userModel.telephone">
          </div>
      </div>
      <div class="form-group">
          <label for="inputtext4" class="col-sm-2 control-label col-sm-offset-3">电子邮箱：</label>
          <div class="col-sm-4">
            <input type="text" class="form-control" id="inputtext4" v-model="userModel.email">
          </div>
      </div>
      <div class="form-group">
          <label for="inputtext4" class="col-sm-2 control-label col-sm-offset-3">角色：</label>
          <div class="col-sm-4">
            <select multiple class="form-control" disabled>
              <option v-for="item in userModel.roleList">{{item.rolename}}&nbsp;&nbsp;{{item.roleid}}</option>
            </select>
          </div>
      </div>
      <p class="lx_btn">
        <button type="submit" class="btn btn-default btn-lg">保存</button>
        <button type="button" onclick="window.history.go(-1)" class="btn btn-default btn-lg">返回</button>
      </p>
    </form>
  </div>
</template>

<script>
  import base from '@/service/Base.vue'
  // import axios from 'axios'

  export default {
    name: 'ChangeInfo',
    data: function () {
      return {
        userModel: {
          userid: '',
          username: '',
          mobile: '',
          telephone: '',
          email: ''
        }
      }
    },
    created: function () {
      this.editInit()
    },
    methods: {
      editInit: function () {
        this.userModel = base.user
        // var $this = this
        // function getUser () {
        //   return base.user
        // }
        // function getUserRole () {
        //   $this.$http.post('/api/hedacmdreq', {method: 'UserSearch', userid: base.user.userid}).then(response => {
        //     var body = response.data.HedaACK.Body
        //     if (body.retCode === '0') {
        //       $this.userModel = body
        //     }
        //   })
        // }
        // // 统一请求，处理，必须要等2个请求全完成才能开始处理该数据
        // axios.all([getUser(), getUserRole()]).then(axios.spread((user, userRole) => {
        //   var body = userRole.data.HedaACK.Body
        //   if (body.retCode === '0') {
        //     this.userModel = user
        //     this.roleName = body.rolename
        //     var myList = body.devicelist
        //     for (var i in myList) {
        //       var item = myList[i]
        //       this.selDeviceIds.push(item.privilegeid)
        //     }
        //   }
        // }))
      },
      submit: function () {
        this.$http.post('/api/hedacmdreq', {method: 'UpdateUser', ...this.userModel}).then(response => {
          var body = response.data.HedaACK.Body
          if (body.retCode === '0') {
            window.duang.msg(true, body.retMsg)
          }
        })
      }
    }
  }
</script>
